<template>
    <div id="yuqing">

        <el-backtop></el-backtop>

        <div class="title" >
            <yuqingtitle :onetype="title[this.type-1]" ></yuqingtitle>
        </div>
        <el-divider><i class="el-icon-data-board"></i></el-divider>

        <div class="content">
            <div class="content-ct">
                <yuqingcontent :onetypeinfo="content"></yuqingcontent>
            </div>

            <div class="content-qa">
                <yuqingwenda :qusans="question"></yuqingwenda>
            </div>

        </div>



    </div>
</template>

<script>
    import {
        getYuqingInfoByType, getYuqingQuestionByType,

        getYuqingType,
    } from "../../network/yuqing";
    import Yuqingtitle from "./yuqingchild/yuqingtitle";
    import Yuqingcontent from "./yuqingchild/yuqingcontent";
    import Yuqingwenda from "./yuqingchild/yuqingwenda";


    export default {
        name: "yuqing",
        components: { Yuqingwenda, Yuqingcontent, Yuqingtitle},
        data(){
            return {
                type:1,
                title:[],
                content:[],
                question:[],
                typelen :0
            }
        },
        mounted() {

            this.$bus.$on('itemclick',(type)=>{
            if(this.type !== type){
                this.type = type
                //console.log(this.type);
                getYuqingInfoByType(this.type).then(res=>{
                    if(res){
                        this.content = res.data
                        //console.log(this.content);
                    }
                })
                getYuqingQuestionByType(this.type).then(res=>{
                    if(res){
                        this.question = res.data
                        //console.log(this.question);
                    }
                })
            }

            })
        },
        created() {
            this.type =this.$route.params.type

            getYuqingType().then(res =>{
                //console.log(res.data);
                this.title = res.data
            })
            getYuqingInfoByType(this.type).then(res=>{
                if(res){
                    this.content = res.data
                    //console.log(this.content);
                }
            })
            getYuqingQuestionByType(this.type).then(res=>{
                if(res){
                    this.question = res.data
                    // console.log(this.question);
                }
            })







        },
        methods:{
            reload(){
                this.$forceUpdate()
            }
        }
    }
</script>

<style scoped>
    .content{
        background-color: white;
        border-radius: 25px;

        margin: 5px;
        padding:5px;
        font-family: "Hiragino Sans GB";
        line-height: 1.5;


    }

    .el-icon-data-board{
        border-radius: 25px;
    }


    .content-ct{

        box-shadow: 0 2px 2px rgba(0,0,0,.12), 0 0 6px rgba(0,0,0,.04);
        border-radius: 25px;
        margin: 5px;
        padding:5px;


    }

    .content-qa{
        box-shadow: 0 2px 2px rgba(0,0,0,.12), 0 0 6px rgba(0,0,0,.04);
        border-radius: 25px;
        margin: 5px;
        padding:5px;
    }


</style>